<?php
    require_once("core/functions.php");
    core::getResource("Controller.LoginController");
    session_start();
?>
<?php $title = "Volunteer Report"; ?>
<?php include_once("header.php"); ?>
<div class="centerContent">
    <div id="loader" style="z-index:10; position: absolute; left: 50%"></div>
    <h1 id="personName"></h1>
    <label id="empty">You have not volunteered at any events</label>
    <form id="container" class="reportTable">

    </form>
    <form id="applicantTemplate" class="reportTable" style="display:none; border: solid 2px blue;">
        <table style="border: solid 2px orange">
            <tr>
                <td><h1><input type="hidden" name="applicantionNumber"/></h1></td>
                <td></td>
            </tr>
            <tr>
                <td colspan="2"><hr/></td>
            </tr>
            <tr>
                <td>Attended:</td>
                <td><input type="hidden" name="attended"/></td>
            </tr>
            <tr>
                <td>Hours Worked:</td>
                <td><input type="hidden" name="hoursWorked"/></td>
            </tr>
            <tr>
                <td>Role:</td>
                <td><a title="View Profile">
                        <input type="hidden" name="role"/>
                    </a>
                </td>
            </tr>
            <tr>
                <td>Role Description:</td>
                <td><input type="hidden" name="description"/></td>
            </tr>
            <tr>
                <td>Activity:</td>
                <td><a title="View Profile">
                        <input type="hidden" name="activity"/>
                    </a>
                </td>
            </tr>
            <tr>
                <td>Event:</td>
                <td><a title="View Profile">
                        <input type="hidden" name="event"/>
                    </a>
                </td>
            </tr>
            <tr>
                <td>Application Date:</td>
                <td><input type="hidden" name="dateCreated"/></td>
            </tr>
            <tr>
                <td>Event Date:</td>
                <td><input type="hidden" name="eventDate"/></td>
            </tr>
        </table>
    </form>
</div>
<script>
    var report = (function() {
        var param = UTSDK.getUrlParam("volunteer");
        if (!param)
            window.location = "index.php";
        var form = UTSDK.$("container");
        var loader = UTSDK.$("loader");
        loader.innerHTML = "<img src='images/ajax-loader.gif'/>";
        var json = {volunteer: param};

        window.addEventListener("load", function() {
            UTSDK.AJAX.get("update.php", json, function(responce) {
                responce = JSON.parse(responce);
                UTSDK.setInnerText(UTSDK.$("personName"), responce["name"]);
                populateTable(responce);
                finished();
            }, true);
        });

        function finished() {
            UTSDK.fadeOut(loader, 20);
            UTSDK.fadeIn(form, 20);
        }

        function populateTable(responce) {
            var applicantTemplate = UTSDK.$("applicantTemplate");
            var div = UTSDK.$("container");
            var applied = responce["applied"];
            if (applied.length > 0) {
                UTSDK.addClass(UTSDK.$("empty"), "hidden");
            }
            for (var i = applied.length - 1; i >= 0; i--) {
                var temp = applicantTemplate.cloneNode(true);
                UTSDK.setInnerText(temp.elements["applicantionNumber"].parentElement, "Application " + (i + 1));
                for (var key in applied[i]) {
                    if (!isNaN(key))
                        continue;
                    if (temp.elements[key]) {
                        var elem = temp.elements[key].parentElement;
                        if (key === "role") {
                            elem.href = "viewrole.php?roleId=" + applied[i]["roleId"];
                        }
                        if (key === "activity") {
                            elem.href = "viewactivity.php?activityId=" + applied[i]["activityId"];
                        }
                        if (key === "event") {
                            elem.href = "viewevent.php?eventId=" + applied[i]["eventId"];
                        }
                        UTSDK.setInnerText(elem, applied[i][key]);
                        if (key === "attended") {
                            attendedChange(elem);
                        }
                    }
                }
                div.appendChild(temp.children[0]);
            }
        }
    })();

    function attendedChange(elem) {
        if ("textContent" in elem) {
            if (elem.textContent === "")
                elem.textContent = "Not specified";
            else if(elem.textContent === "1")
                elem.textContent = "Yes";
            else
                elem.textContent = "No";
        }
        else {
            if (elem.innerText === "")
                elem.innerText = "Not specified";
            else if(elem.innerText === "1")
                elem.innerText = "Yes";
            else
                elem.innerText = "No";
        }
    }
</script>
<?php include_once("footer.php"); ?>